import React from 'react';
// import {PageContainer} from '@ant-design/pro-layout';
import PageHeader from '@/components/PageHeader';
import {Card, Alert, Typography} from 'antd';

const {Link} = Typography;

export default (): React.ReactNode => (
    <PageHeader>
        <Card title="为什么要使用飞轮">
            <Alert
                message="1、飞轮是一个脚手架，开箱即用的中台项目，集成常用功能，例如cas、mew、魔方等"
                type="success"
                showIcon
                banner
                style={{
                    margin: -12,
                    marginBottom: 24,
                }}
            />
            <Alert
                message="2、飞轮提供了常规功能示例代码，是B端功能示范代码和CR要求标准；每个人都应当学习和执行，并贡献优秀代码，争取把B端示功能例代码可覆盖范围越来越高，让B端代码质量越来越高，有效减少bug"
                type="success"
                showIcon
                banner
                style={{
                    margin: -12,
                    marginBottom: 24,
                }}
            />
            <Alert
                message="3、UE规范示例落地"
                type="success"
                showIcon
                banner
                style={{
                    margin: -12,
                    marginBottom: 24,
                }}
            />
            {/* <Alert
                message="看不懂下面的代码么"
                type="warning"
                showIcon
                banner
                style={{
                    margin: -12,
                    marginBottom: 24,
                }}
            />
            <Space direction="vertical">
                <Text code>const [state, setstate] = useState(initialState);</Text>
                <Paragraph code>
                    {`useEffect(() => {
                        console.log('do some thing')
                    }, [])`}
                </Paragraph>
            </Space>
            <Alert
                message="如果看不懂上面代码，就需要学习一下React Hooks了"
                type="warning"
                showIcon
                banner
                style={{
                    margin: -12,
                    marginBottom: 24,
                }}
            /> */}
        </Card>
        <br />
        <Card title="怎么学习飞轮">
            要想学习飞轮：你要掌握 antd + ant pro+hooks + ahook + umi3+ typescript +飞途，并学习每一个功能示例代码
            <br />
            <Link href="https://react-1251415695.cos-website.ap-chengdu.myqcloud.com/docs/hooks-intro.html" target="_blank">
                ReactHooks
            </Link>
            <br />
            <Link href="https://ahooks.js.org/zh-CN" target="_blank">
                ahooks
            </Link>
            <br />
            <Link href="https://umijs.org/zh-CN/docs" target="_blank">
                umi
            </Link>
            <br />
            <Link href="https://beta-pro.ant.design/index-cn" target="_blank">
                ant pro
            </Link>
            <br />
            <Link href="https://typescript.bootcss.com/" target="_blank">
                typescript
            </Link>
            <br />
            <Link href="https://ant.design/components/overview-cn/" target="_blank">
                antd
            </Link>
            <br />
            <Link href="https://feitu.gaotu100.com/index-cn" target="_blank">
                飞途
            </Link>
        </Card>
        <br />
        <Card title="代码贡献">
            吴修展（框架搭建、查询功能示范代码）
            <br />
            林世玉（编辑功能示范代码）
            <br />
            姜思佳（接入imis）
            <br />
        </Card>
    </PageHeader>
);
